<!--
  Copyright (c) 2011 Google Inc.

  Licensed under the Apache License, Version 2.0 (the "License"); you may not
  use this file except in compliance with the License. You may obtain a copy of
  the License at

  http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
  WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
  License for the specific language governing permissions and limitations under
  the License.

  To run this sample, replace "apiKey" and "clientId" with your own values.
  They can be found at https://code.google.com/apis/console/?api=calendar under API Access.
-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8' />
    <title>JS Client RPC Body Sample</title>
    <style>
      #info {
        border: 1px solid black;
        padding: 0.25em;
        margin: 0.5em 0;
      }
    </style>
    <script>
      // Enter the API key from the Google Develoepr Console - to handle any unauthenticated
      // requests in the code.
      // The provided key works for this sample only when run from
      // https://google-api-javascript-client.googlecode.com/hg/samples/rpcRequestBody.html
      // To use in your own application, replace this API key with your own.
      var apiKey = 'AIzaSyAdjHPT5Pb7Nu56WJ_nlrMGOAgUAtKjiPM';

      // Enter a client ID for a web application from the Google Developer Console.
      // The provided clientId will only work if the sample is run directly from
      // https://google-api-javascript-client.googlecode.com/hg/samples/rpcRequestBody.html
      // In your Developer Console project, add a JavaScript origin that corresponds to the domain
      // where you will be running the script.
      var clientId = '837050751313';

      var scopes = 'https://www.googleapis.com/auth/calendar';

      // The Calendar entry to create
      var resource = {
        "summary": "Appointment",
        "location": "Somewhere",
        "start": {
          "dateTime": "2011-12-16T10:00:00.000-07:00"
        },
        "end": {
          "dateTime": "2011-12-16T10:25:00.000-07:00"
        }
      };

      function init() {
        gapi.client.setApiKey(apiKey);
        gapi.auth.init(load);
      }

      function load() {
        gapi.client.load('calendar', 'v3', auth);
      }

      function auth() {
        gapi.auth.authorize({
          'client_id': clientId,
          'scope': scopes,
          'immediate': false
        });
      }

      function makeRpcRequest() {
        var request = gapi.client.calendar.events.insert({
          'calendarId': 'primary',
          'resource': resource
        });
        request.execute(writeResponse);
      }

      function makeRestRequest() {
        gapi.client.request({
          'path': '/calendar/v3/calendars/primary/events',
          'method': 'POST',
          'body': resource,
          'callback': writeResponse
        });
      }

      function writeResponse(response) {
        console.log(response);
        var creator = response.creator.email;
        var calendarEntry = response.htmlLink;
        var infoDiv = document.getElementById('info');
        var infoMsg = document.createElement('P');
        infoMsg.appendChild(document.createTextNode('Calendar entry ' +
            'successfully created by ' + creator));
        infoDiv.appendChild(infoMsg);
        var entryLink = document.createElement('A');
        entryLink.href = calendarEntry;
        entryLink.appendChild(
            document.createTextNode('View the Calendar entry'));
        infoDiv.appendChild(entryLink);
      }
    </script>
    <script src="https://apis.google.com/js/client.js?onload=init"></script>
  </head>
  <body>
    <p>
      This sample creates a Calendar entry for the logged-in user on Friday, 
      December 16, 2011 from 10:00 to 10:25. The entry will not be saved unless
      you click through to the Calendar entry and save it.
    </p>
    <button id="rpc" onclick="makeRpcRequest();">Make RPC Request</button>
    <button id="rest" onclick="makeRestRequest();">Make REST Request</button>
    <div id="info"></div>
  </body>
</html>
